
<template>
	<view class="content">
		<view class="content-top">
			<!-- 轮播图 -->
			<view class='swiper'>
				<swiper class="swiper-c" :indicator-dots="swiper.indicatorDots" :autoplay="swiper.autoplay" :interval="swiper.interval"
				 :duration="swiper.duration">
					<swiper-item class="have-none" v-for="(item, index) in goodsInfo.album" :key="index" @click="clickImg(item)">
						<image class='' :src='item' mode="aspectFill"></image>
					</swiper-item>
				</swiper>
			</view>
			<!-- 轮播图end -->
			<view class="paoma" v-if="scrollBar!=''">
				<swiper class="paoma-c" :indicator-dots="false" :autoplay="true" :interval="3000" :duration="1000" :vertical="true" :circular="true">
					<swiper-item v-for="item in scrollBar">
						<view class="swiper-item" style="font-size: 14px;text-overflow:ellipsis; white-space:nowrap; overflow:hidden;">{{item.content}}</view>
					</swiper-item>
				</swiper>
			</view>
			<view class='cell-group'>
				<view class='cell-item goods-top'>
					<view class='cell-item-hd aa_bh' style="width: 100%;">
						<view class='cell-hd-title aa_bh goods-price red-price' style="font-size:21px;font-weight: bold;width: 100%;">{{ product.price || '0.00' }}万 <text style="    font-size: 18px;
    color: #000;
    padding-left: 10px;">服务费：{{sincerity_gold}}元</text> </view>
					</view>
					<view class='cell-item-ft' style="position: absolute;right: 17px;">
						<image src="/static/images/fengxiang.png" style="width: 20px;height: 22px;position: absolute;" @click="goShare()"></image>
						<view style="    margin-top: 37px;">分享</view>
					</view>
				</view>

				<view class='cell-item goods-details'>
					<view class='cell-item-hd aa_bh' >
						<view class='cell-hd-title aa_bh'>
							<view class="color-3  " style="font-size: 16px;font-weight: bold;">
								{{ product.name || '' }}
							</view>
							<text v-if="goodsInfo.brief" class="color-9 fsz24 ">
								{{ goodsInfo.brief || '' }}
							</text>
							<view style="font-size: 12px;color: #999999;padding-top: 10px;">{{product.info}}</view>
							
							<view style="display: flex;flex-direction: row; align-items: center; justify-content: space-between;
    width: 100%;">
							<text style="color: rgb(153, 153, 153);
							font-size: 14px;
							margin: 10px 0px;
							display: block;">
							编号：{{product.code}}
							</text>
						
							<text style="color: rgb(153, 153, 153);font-size: 12px; display: block;">浏览次数：{{goodsInfo.view_count}}</text>
							</view>
							<view style="margin-top: 2px;">
								<text style="width:29px;height:15px;background:rgba(233,146,62,0.1);border-radius:1px;color: #E9923E;font-size: 12px;padding:3px 5px;margin-right: 5px;">{{product.trade_type}}</text>
								<text style="width:29px;height:15px;background:rgba(6,139,248,0.1);border-radius:1px;color: #068BF8;font-size: 12px;padding:3px 5px;">{{product.transfer_type}}</text>
							</view>
						</view>
					</view>
				</view>

				<view class="car-time">
					<view class="car-time-item">
						<view style="font-size: 14px;color: #333333;" v-if="product.factory_date">{{product.factory_date.substring(0,4)}}年</view>
						<view style="font-size: 10px;color: #999999;">出厂时间</view>
					</view>
					<view class="car-time-item">
						<view style="font-size: 14px;color: #333333;">{{product.hours}}{{li}}</view>
						<view style="font-size: 10px;color: #999999;">{{leisong}}</view>
					</view>
					<view class="car-time-item">
						<view style="font-size: 14px;color: #333333;" v-if="product.ctime">{{product.ctime.substring(0,10)}}</view>
						<view style="font-size: 10px;color: #999999;">发布时间</view>
					</view>
				</view>
			</view>
		
			<view class="goods-content">
				<view style="font-size: 12px;color: #333333;text-align: center;">设备详情</view>
				<view style="    margin: 8px 16px 25px 16px;">
					<view class="info-table">
						<view class="table-item">
							<view class="table-title">设备品牌<text class="table-main">{{product.brand.name}}</text></view>
						</view>
						<view class="table-item">
							<view class="table-title">{{bijia}}<text class="table-main">{{product.length}}{{mi}}</text></view>
						</view>
						<view class="table-item">
							<view class="table-title">汽车底盘<text class="table-main">{{product.car_chassis}}</text></view>
						</view>
						<view class="table-item">
							<view class="table-title">排放标准<text class="table-main">{{product.pumping}}</text></view>
						</view>
						<view class="table-item">
							<view class="table-title">还款情况<text class="table-main">{{product.repay}}</text></view>
						</view>
						<view class="table-item">
							<view class="table-title">登记证书<text class="table-main">{{product.prove}}</text></view>
						</view>
						<view class="table-item">
							<view class="table-title">行驶证<text class="table-main">{{product.driving_license}}</text></view>
						</view>
						<view class="table-item">
							<view class="table-title">过户情况<text class="table-main">{{product.transfer_type}}</text></view>
						</view>
					</view>
				</view>
				<view style="width: 100%;display: flex;flex-direction: column;">
					<image src="/static/images/carinfo.png" style="width: 100%;"></image>
					<image src="/static/images/cheliang.jpg" style="width: 100%;"  mode="widthFix"></image>
					<view  v-for="(item, index) in goodsInfo.album" >
					<image :src="item" style="width: 100%;display: block;"  @click="clickImg(item)"  mode="widthFix"></image>
					</view>
				</view>
			</view>
			<!--推荐-->
			<view style=" padding: 15px 0px 65px 15px;background-color: #fff;" v-if='recomList.length>1'>
			<view style=" font-weight: bold;">为您推荐</view>
			<view class="retoyou">
				<view class="reto-item" v-for="(itemgood,index4) in recomList" :key='index4' v-if="index4>0&&index4<=6" @click="hanldRecom(itemgood)">
					<view style="width: 100%;height: 108px;">
						<image :src='itemgood.image_url' style="width: 100%;height: 100%;    border-radius: 7px;" ></image>
					</view>
					<view class="reto-title">{{itemgood.name}}</view>
					<view class="reto-pci">{{itemgood.price}}万</view>
				</view>
				
			</view>
			</view>
		</view>

		<lvv-popup position="bottom" ref="share">

			<!-- #ifdef H5 -->
			<shareByH5 :ifwx="ifwx" :goodsId="goodsInfo.id" :shareImg="goodsInfo.image_url" :shareTitle="goodsInfo.name"
			 :shareContent="goodsInfo.brief" :shareHref="shareHref" @close="closeShare()"></shareByH5>
			<!-- #endif -->

			<!-- #ifdef MP-WEIXIN -->
			<shareByWx :goodsId="goodsInfo.id" :shareImg="goodsInfo.image_url" :shareTitle="goodsInfo.name" :shareContent="goodsInfo.brief"
			 :shareHref="shareHref" @close="closeShare()"  mode='widthFix' :pageValue='10'></shareByWx>
			<!-- #endif -->

			<!-- #ifdef MP-ALIPAY -->
			<shareByAli :goodsId="goodsInfo.id" :shareImg="goodsInfo.image_url" :shareTitle="goodsInfo.name" :shareContent="goodsInfo.brief"
			 :shareHref="shareHref" @close="closeShare()"></shareByAli>
			<!-- #endif -->

			<!-- #ifdef MP-TOUTIAO -->
			<shareByTt :goodsId="goodsInfo.id" :shareImg="goodsInfo.image_url" :shareTitle="goodsInfo.name" :shareContent="goodsInfo.brief"
			 :shareHref="shareHref" @close="closeShare()"></shareByTt>
			<!-- #endif -->

			<!-- #ifdef APP-PLUS || APP-PLUS-NVUE -->
			<shareByApp :goodsId="goodsInfo.id" :shareImg="goodsInfo.image_url" :shareTitle="goodsInfo.name" :shareContent="goodsInfo.brief"
			 :shareHref="shareHref" @close="closeShare()"></shareByApp>
			<!-- #endif -->

		</lvv-popup>

		<!-- 弹出层 -->
		<lvv-popup position="bottom" ref="lvvpopref">
			<view style="width: 100%;max-height: 804upx;background: #FFFFFF;position: absolute;left:0;bottom: 0;">
				<view class="pop-c">
					<view class="pop-t">
						<view class='goods-img'>
							<image :src='product.image_path' mode='aspectFill'></image>
						</view>
						<view class='goods-information'>
							<view class='pop-goods-name'>{{ product.name || ''}}</view>
							<view class='pop-goods-price red-price'>￥ {{ product.price || ''}}</view>
						</view>
						<view class='close-btn' @click="toclose()">
							<image src='/static/image/close.png'></image>
						</view>
					</view>
					<scroll-view class="pop-m" scroll-y="true" style="max-height: 560upx;">
						<spec :spesData="defaultSpesDesc" ref="spec" @changeSpes="changeSpes"></spec>
						<view class="goods-number">
							<text class="pop-m-title">数量</text>
							<view class="pop-m-bd-in">
								<uni-number-box :min="minNums" :max="product.stock" :value="buyNum" @change="bindChange"></uni-number-box>
							</view>
						</view>
					</scroll-view>
					<view class="pop-b">
						<button class='btn btn-square btn-b btn-all' hover-class="btn-hover2" @click="clickHandle()" :disabled='submitStatus'
						 :loading='submitStatus' v-if="product.stock">确定</button>
						<button class='btn btn-square btn-g btn-all' v-else>已售罄</button>
					</view>
				</view>
			</view>
		</lvv-popup>
		<!-- 弹出层end -->

		<div id="qrCode" ref="qrCodeDiv"></div>
		<!-- 底部按钮 -->
		<view class="goods-bottom" style="display: flex; flex-direction: row; justify-content: space-between;bottom: 0px;box-shadow:none;padding:0 0 30upx 0;height: auto;align-items: center;">
			<!-- 客服按钮 -->
			
			<view class="goods-bottom-ic" @click="collection">
				<image class="icon" :src="isfav ? favLogo[1] : favLogo[0]" mode="" style="width: 19px;height: 19px;"></image>
				<view v-if="!isfav">关注</view>
				<view v-if="isfav">已关注</view>
			</view>
			<view class="goods-bottom-ic" @click="hanldPhone()">
				<image class="icon" src="/static/images/dianhua.png" mode="" style="width: 19px;height: 19px;"></image>
				<view>询底价</view>
			</view>
		<form class="goods-bottom-ic" @submit="hanldIndex" report-submit="true" style="flex: 1;
    font-size: 15px;
    color: #fff;
    background-color: #FE912A;
    height: 90upx;
    text-align: center;
    line-height: 90upx;">
				<button form-type="submit" style="font-size: 15px;
    color: #fff;
    background-color: #FE912A;
    height: 90upx;
    text-align: center;
    line-height: 90upx;border:none">
				支付服务费</button>
			</form>
			<button class="btn btn-square btn-b" hover-class="none" open-type="contact" bindcontact="showChat"
			 :session-from="kefupara" style="margin: 0;    width: 37%;">
				<view>在线咨询</view>
			</button>
		</view>
		<!-- 底部按钮end -->
	<!--咨询-->
	<uni-popup ref="popup" type="center" :maskClick="maskClick">
		<view class="father-wrapper">
				<view id="son">
					<view style="margin-top: 18px;font-size: 17px;color: #333;font-weight: bold;">免费通话</view>
					<image src="/static/images/baotuiyuan.png" style="width: 24px;height: 24px;float: right; margin-top: -24px;
		margin-right: 16px;"></image>
					<view style="font-weight: normal;font-size: 12px;color: #666666;padding: 21px 16px 15px 16px">对设备感兴趣？你的所有问题一通电话全解决！</view>
					<view class="fee-input" style="font-size: 17px;color: #333;font-weight: bold;">{{contact}}</view>
					<view class="fee-but"  @click="hanldCall()">确定</view>
				</view>
			</view>
	</uni-popup>
		
	</view>
</template>

<script>
	import uniPopup from '@/components/uni-popup/uni-popup.vue'
	import uniPopupMessage from '@/components/uni-popup/uni-popup-message.vue'
	import uniPopupDialog from '@/components/uni-popup/uni-popup-dialog.vue'
	//
	
	import uniSegmentedControl from "@/components/uni-segmented-control/uni-segmented-control.vue";
	import lvvPopup from '@/components/lvv-popup/lvv-popup.vue';
	import uniNumberBox from "@/components/uni-number-box/uni-number-box.vue";
	import uniRate from "@/components/uni-rate/uni-rate.vue";
	import uniLoadMore from '@/components/uni-load-more/uni-load-more.vue';
	import uniFab from '@/components/uni-fab/uni-fab.vue';
	import {
		get
	} from '@/config/db.js';
	import {
		apiBaseUrl
	} from '@/config/config.js'
	import spec from '@/components/spec/spec.vue'
	// #ifdef H5
	import shareByH5 from '@/components/share/shareByh5.vue'
	// #endif
	// #ifdef MP-WEIXIN
	import shareByWx from '@/components/share/shareByWx.vue'
	// #endif
	// #ifdef MP-TOUTIAO
	import shareByTt from '@/components/share/shareByTt.vue'
	// #endif
	// #ifdef MP-ALIPAY
	import shareByAli from '@/components/share/shareByAli.vue'
	// #endif
	// #ifdef APP-PLUS || APP-PLUS-NVUE
	import shareByApp from '@/components/share/shareByApp.vue'
	// #endif
	import jshopContent from '@/components/jshop/jshop-content.vue' //视频和文本解析组件

	export default {
		components: {
			 uniPopup,
			uniPopupMessage,
			uniPopupDialog,
			uniSegmentedControl,
			lvvPopup,
			uniNumberBox,
			uniRate,
			uniLoadMore,
			uniFab,
			spec,
			jshopContent,
			// #ifdef H5
			shareByH5,
			// #endif
			// #ifdef MP-WEIXIN
			shareByWx,
			// #endif
			// #ifdef MP-TOUTIAO
			shareByTt,
			// #endif
			// #ifdef MP-ALIPAY
			shareByAli,
			// #endif
			// #ifdef APP-PLUS || APP-PLUS-NVUE
			shareByApp,
			// #endif
		},
		data() {
			return {
				maskClick:true,
				kefupara:"",
				swiper: {
					indicatorDots: true,
					autoplay: true,
					interval: 3000,
					duration: 800,
				}, // 轮播图属性设置
				items: ['图文详情', '商品参数', '买家评论'],
				current: 0, // init tab位
				goodsId: 0, // 商品id
				goodsInfo: {}, // 商品详情
				cartNums: 0, // 购物车数量
				product: {}, // 规格详情
				goodsParams: [], // 商品参数信息
				goodsComments: {
					loadStatus: 'more',
					page: 1,
					limit: 5,
					list: []
				}, // 商品评论信息
				buyNum: 1, // 选定的购买数量
				minBuyNum: 1, // 最小可购买数量
				type: 2, // 1加入购物车 2购买
				isfav: false, // 商品是否收藏
				favLogo: [
					'/static/images/shoucang2.png',
					'/static/images/shoucang.png'
				],
				horizontal: 'right', //右下角弹出按钮
				vertical: 'bottom',
				direction: 'vertical',
				pattern: {
					color: '#7A7E83',
					backgroundColor: '#fff',
					selectedColor: '#007AFF',
					buttonColor: "#D62222"
				},
				content: [{
						iconPath: '/static/image/tab-ic-hom-selected.png',
						selectedIconPath: '/static/image/tab-ic-hom-unselected.png',
						// text: '首页',
						active: false,
						url: '/pages/index/index'
					},
					{
						iconPath: '/static/image/tab-ic-me-selected.png',
						selectedIconPath: '/static/image/tab-ic-me-unselected.png',
						// text: '个人中心',
						active: false,
						url: '/pages/member/index/index'
					}
				],
				submitStatus: false,
				config: '', //配置信息
				goodsShowWord: [],
				shareUrl: '/pages/share/jump',
				contact:"",
				showfat:true,
				recomList:[],//推荐列表
				car_type:"",//车型
				recar_type:"",
				scrollBar:"",//滚动
				sincerity_gold:0,//服务费
				vehicle:'',
				myShareCode: '', //分享Code
				scene:'',
				//
				leisong:'',//泵送方量变化
				bijia:'',
				mi:'',
				li:'',
				invite:''
			}
		},
		onLoad(options) {
		
			//获取商品ID
			if (options.id != '') {
				this.goodsId = options.id;
			}

			if (this.goodsId) {
				this.getGoodsDetail();
				this.getGoodsParams();
				this.getGoodsComments();
				this.getcCar_trading();
			} else {
				this.$common.errorToShow('获取失败', () => {
					uni.navigateBack({
						delta: 1
					});
				});
			}

			// 获取购物车数量
			this.getCartNums();
			this.$api.shopConfig(res => {
				this.config = res;
				console.log(res)
				this.goodsShowWord = res.goods_show_word;
			});
			var _this = this
			if (this.$db.get('userToken')) {
				this.$api.userInfo({}, res => {
					if (res.status) {
						_this.userInfo = res.data
						// #ifdef MP-WEIXIN
						//微信小程序打开客服时，传递用户信息
						var kefupara = {}
						kefupara.nickName = res.data.nickname
						kefupara.tel = res.data.mobile
						_this.kefupara = JSON.stringify(kefupara)
						// #endif
					}
				})
			};
			this.ifwxl();
			if(options.scene){
				this.invite = options.scene;
				this.$db.set('invitecode',this.invite);
				console.log(this.invite+'详情页code');
			}
		
			console.log(options)
		},
		onShow() {
			this.submitStatus = false;
			this.getCigfont();
			this.getScrollBar();
			this.initData();
			this.getMyShareCode()
		},
		computed: {
			// 规格切换计算规格商品的 可购买数量
			minNums() {
				return this.product.stock > this.minBuyNum ? this.minBuyNum : this.product.stock;
			},
			// 判断商品是否是多规格商品  (为了兼容小程序 只能写在计算属性里面了)
			isSpes() {
				if (this.product.hasOwnProperty('default_spes_desc') && Object.keys(this.product.default_spes_desc).length) {
					return true;
				} else {
					return false;
				}
			},
			// 优惠信息重新组装
			promotion() {
				let arr = [];
				if (this.product.promotion_list) {
					for (let k in this.product.promotion_list) {
						arr.push(this.product.promotion_list[k]);
					}
				}
				return arr;
			},
			shareHref() {
				let pages = getCurrentPages()
				let page = pages[pages.length - 1];
				console.log(page);
				console.log("carindex---page")
				// #ifdef H5 || MP-WEIXIN || APP-PLUS || APP-PLUS-NVUE
				return apiBaseUrl + 'wap/' + page.route + '?id=' + this.goodsId;
				// #endif

				// #ifdef MP-ALIPAY
				return apiBaseUrl + 'wap/' + page.__proto__.route + '?id=' + this.goodsId;
				// #endif
			},
			// 获取店铺联系人手机号
			shopMobile() {
				return this.$store.state.config.shop_mobile || 0;
			},
			defaultSpesDesc() {
				return this.product.default_spes_desc;
			}
		},
		onReachBottom() {
			if (this.current === 2 && this.goodsComments.loadStatus === 'more') {
				this.getGoodsComments();
			}
		},
		methods: {
			getMyShareCode() {
				let userToken = this.$db.get("userToken");
				if (userToken && userToken != '') {
					// 获取我的分享码
					this.$api.shareCode({}, res => {
						if (res.status) {
							this.myShareCode = res.data ? res.data : '';
						}
					});
				}
			},
			getcCar_trading() {
				   
			   let data = {
				   car_id:this.goodsId
			   }
				this.$api.car_trading(data,res => {
					this.config = res;
					this.vehicle = res.data;
					console.log(res)
					console.log('vvvvv面膜')
					
				})
				},
			initData() {
				// 获取用户信息
				var _this = this
				//判断是开启分销还是原始推广
				this.$api.shopConfig(res => {
					this.config = res;
					this.sincerity_gold = this.config.sincerity_gold;
					console.log(this.sincerity_gold+'show_mm')
					
				})
				},
			getScrollBar() {
				let data = {
					
				}
				this.$api.carsucc(data, res => {
					if (res.status) {
						this.scrollBar = res.data;
						console.log(this.scrollBar)
					} else {
						this.$common.errorToShow(res.msg);
					}
				});
			},
			
		
			hanldRecom(item){
				this.goodsId = item.id;
				this.getGoodsDetail();
				
				uni.pageScrollTo({
				
				scrollTop: 0,
				
				duration: 300
				
				});
			},
			getGoods() {
					let that = this;
				console.log(this.recar_type)
				console.log("recar_type")
					let listsrr = JSON.stringify({car_type:this.recar_type})
			
					console.log(listsrr)
					let data = {
						page: '',
						limit: '',
						order:'sort asc',
						where:listsrr
					}
					that.$api.cargetlist(data, function(res) {
						if (res.status) {
							
						that.recomList = res.data.list
							console.log(that.recomList)
							console.log("11")
						} else {
							that.$common.errorToShow(res.msg)
						}
					});
				},
			hanldCall() {
				let that = this;
				that.$refs.popup.close()
				console.log(typeof that.contact)
				  wx.makePhoneCall({
					phoneNumber: that.contact+''
				  });
			},
			getCigfont(){
				this.$api.shopConfig(res => {
					this.contact = res.shop_mobile;
				})
			},
			
			hanldIndex(e){
				console.log(e)
				console.log("indexeee");
				// let formId = e.detail.formId;
					let formId = {
						formid: `${e.detail.formId}`
						// return_url: "http://localhost:8080/wap/pages/goods/payment/result",
						// trade_type: "MWEB"
					}
				let data = {
					payment_code:"wechatpay",
					payment_type: 3,
					params:formId
				}
				 data['ids'] = this.vehicle 
				
				this.$api.pay(data, res => {
					if (res.status) {
						console.log(res);
						console.log('支付支付')
						uni.requestPayment({
							provider: 'wxpay',
							timeStamp: res.data.timeStamp,
							nonceStr: res.data.nonceStr,
							package: res.data.package,
							signType: res.data.signType,
							paySign: res.data.paySign,
							success: function(e) {
								console.log(e)
								if (e.errMsg === 'requestPayment:ok') {
									uni.redirectTo({
									  url: '/pages/goods/payment/result1?id=' + res.data.payment_id
									})
								}
							},
							  fail(res) {
								  uni.redirectTo({
								    url: '/pages/goods/payment/result1?id=' + res.data.payment_id
								  })
								}
						});
					} else {
						this.$common.errorToShow(res.msg)
					}
			})
			},
			//问底价
			hanldPhone(){
				// uni.navigateTo({
				// 	url:'freeCall'
				// })
				  this.$refs.popup.open()
				let data = {
					car_id:this.goodsInfo.id
				}
				this.$api.carinquiry(data, res => {
					if (res.status == true) {
						console.log('询价了')
					}
			})
			},
			
			// 判断是不是微信浏览器
			ifwxl() {
				this.ifwx = this.$common.isWeiXinBrowser()
			},
			// 返回上一页
			backBtn() {
				var pages = getCurrentPages();
				if (pages.length > 1) {
					uni.navigateBack({
						delta: 1
					});
				} else {
					uni.switchTab({
						url: '/pages/index/index'
					});
				}
			},
			// 获取商品详情
			getGoodsDetail() {
				let data = {
					id: this.goodsId
				}

				// 如果用户已经登录 要传用户token
				let userToken = this.$db.get("userToken");

				if (userToken) {
					data['token'] = userToken;
				}

				this.$api.cargetdetial(data, res => {
				
					if (res.status == false) {
						let info = res;
						let products = res.data;

						//var htmlString = info.intro; //replace(/\\/g, "").replace(/<img/g, "<img style=\"display:none;\"")
						//info.intro = htmlParser(htmlString);
						this.goodsInfo = info.data;
						this.car_type = info.data.car_type;
						
							if(this.car_type=="泵车"){
								this.recar_type = '1';
								this.leisong = '泵送方量';
								this.bijia = '臂架长度';
								this.mi = '米';
								this.li = '万方';
							}
							if(this.car_type=="拖泵"){
								this.recar_type = '2';
								this.leisong = '泵送时间';
								this.bijia = '出口压力';
								this.mi = '兆帕';
								this.li = '小时'
							}
							if(this.car_type=="车载泵"){
								this.recar_type = '3';
								this.leisong = '泵送时间';
								this.bijia = '出口压力';
								this.mi = '兆帕';
								this.li = '小时'
							}
							if(this.car_type=="搅拌车"){
								this.recar_type = '4';
								this.leisong = '行驶里程';
								this.bijia = '罐子容积';
								this.mi = '方';
								this.li = '公里'
							}
							this.getGoods()
								
						this.isfav = this.goodsInfo.isfav === 'true' ? true : false;
						this.product = this.spesClassHandle(products);



						// 判断如果登录用户添加商品浏览足迹
						if (userToken) {
							this.goodsBrowsing();
						}
					} else {
						// this.$common.errorToShow(res.msg, () => {
						// 	uni.navigateBack({
						// 		delta: 1
						// 	});
						// })
					}
				})
			},
			// 获取购物车数量
			getCartNums() {
				let userToken = this.$db.get("userToken");
				if (userToken && userToken != '') {
					// 获取购物车数量
					this.$api.getCartNum({}, res => {
						if (res.status) {
							this.cartNums = res.data;
						}
					})
				}
			},
			// 显示modal弹出框
			toshow(type) {
				this.type = type;
				this.$refs.lvvpopref.show();
			},
			// 关闭modal弹出框
			toclose() {
				this.$refs.lvvpopref.close();
			},
			// 切换商品规格
			changeSpes(obj) {
				let index = obj.v;
				let key = obj.k;

				let userToken = this.$db.get('userToken');
				let tmp_default_spes_desc = JSON.parse(this.product.default_spes_desc);
				if (tmp_default_spes_desc[index][key].hasOwnProperty('product_id') && tmp_default_spes_desc[index][key].product_id) {
					this.$refs.spec.changeSpecData();
					this.$api.getProductInfo({
						id: tmp_default_spes_desc[index][key].product_id,
						token: userToken
					}, res => {
						if (res.status == true) {
							// 切换规格判断可购买数量
							this.buyNum = res.data.stock > this.minBuyNum ? this.minBuyNum : res.data.stock;
							this.product = this.spesClassHandle(res.data);
						}
					});
					uni.showLoading({
						title: '加载中'
					});
					setTimeout(function() {
						uni.hideLoading();
					}, 1000);
				}
			},
			// 多规格样式统一处理
			spesClassHandle(products) {
				// 判断是否是多规格 (是否有默认规格)
				if (products.hasOwnProperty('default_spes_desc')) {
					let spes = products.default_spes_desc;
					for (let key in spes) {
						for (let i in spes[key]) {
							if (spes[key][i].hasOwnProperty('is_default') && spes[key][i].is_default === true) {
								this.$set(spes[key][i], 'cla', 'pop-m-item selected');
							} else if (spes[key][i].hasOwnProperty('product_id') && spes[key][i].product_id) {
								this.$set(spes[key][i], 'cla', 'pop-m-item not-selected');
							} else {
								this.$set(spes[key][i], 'cla', 'pop-m-item none');
							}
						}
					}
					spes = JSON.stringify(spes)
					products.default_spes_desc = spes;
				}
				return products;
			},
			// 购买数量加减操作
			bindChange(val) {
				this.buyNum = val;
			},
			// 商品收藏/取消
			collection() {
				let data = {
					car_id: this.goodsInfo.id
				}
				this.$api.carcollection(data, res => {
					if (res.status) {
						this.isfav = !this.isfav;
						this.$common.successToShow(res.msg);
					} else {
						this.$common.errorToShow(res.msg);
					}
				})
			},
			// tab点击切换
			onClickItem(index) {
				if (this.current !== index) {
					this.current = index;
				}
			},
			// 获取商品参数信息
			getGoodsParams() {
				this.$api.goodsParams({
					id: this.goodsId
				}, res => {
					if (res.status == true) {
						this.goodsParams = res.data;
					}
				})
			},
			// 获取商品评论信息
			getGoodsComments() {
				let data = {
					page: this.goodsComments.page,
					limit: this.goodsComments.limit,
					goods_id: this.goodsId
				}

				this.goodsComments.loadStatus = 'loading';

				this.$api.goodsComment(data, res => {
					if (res.status == true) {
						let _list = res.data.list;
						let count = res.data.count;
						this.items = ['图文详情', '商品参数', '买家评论(' + count + ')']
						// 如果评论没有图片 在这块作处理否则控制台报错
						_list.forEach(item => {
							item.ctime = this.$common.timeToDate(item.ctime, true);
							if (!item.hasOwnProperty('images_url')) {
								this.$set(item, 'images_url', [])
							}
						});

						this.goodsComments.list = [...this.goodsComments.list, ..._list];
						// 根据count数量判断是否还有数据
						if (res.data.count > this.goodsComments.list.length) {
							this.goodsComments.loadStatus = 'more';
							this.goodsComments.page++;
						} else {
							this.goodsComments.loadStatus = 'noMore';
						}
					} else {
						this.$common.errorToShow(res.msg);
					}
				})
			},
			// 添加商品浏览足迹
			goodsBrowsing() {
				let data = {
					goods_id: this.goodsInfo.id
				}

				this.$api.addGoodsBrowsing(data, res => {});
			},
			// 加入购物车
			addToCart() {
				if (this.buyNum > 0) {
					let data = {
						product_id: this.product.id,
						nums: this.buyNum
					}
					this.$api.addCart(data, res => {
						if (res.status) {
							this.toclose(); // 关闭弹出层
							this.getCartNums(); // 获取购物车数量
							this.$common.successToShow(res.msg);
						} else {
							this.$common.errorToShow(res.msg);
						}
					}, res => {
						this.submitStatus = false;
					})
				}
			},
			// 立即购买
			buyNow() {
				if (this.buyNum > 0) {
					let data = {
						product_id: this.product.id,
						nums: this.buyNum,
						type: 2 // 区分加入购物车和购买
					}

					this.$api.addCart(data, res => {
						if (res.status) {
							this.toclose();
							let cartIds = res.data;
							this.$common.navigateTo('/pages/goods/place-order/index?cart_ids=' + JSON.stringify(cartIds));
						} else {
							this.$common.errorToShow(res.msg);
						}
					}, res => {
						this.submitStatus = false;
					})
				}
			},
			// 购物车页面跳转
			redirectCart() {
				uni.switchTab({
					url: '/pages/cart/index/index'
				});
			},
			// 点击弹出框确定按钮事件处理
			clickHandle() {
				this.submitStatus = true;
				this.type === 1 ? this.addToCart() : this.buyNow();
			},
			trigger(e) {
				this.content[e.index].active = !e.item.active;
				uni.switchTab({
					url: e.item.url
				})
			},
			// 跳转到h5分享页面
			goShare() {
				this.$refs.share.show();
			},
			closeShare() {
				this.$refs.share.close();
			},
			// 图片点击放大
			clickImg(imgs) {
				console.log(imgs)
				// 预览图片
				uni.previewImage({
					urls: imgs.split()
				});
			},
			//在线客服,只有手机号的，请自己替换为手机号
			showChat() {
				let _this = this;
				// #ifdef H5
				window._AIHECONG('ini', {
					entId: this.config.ent_id,
					button: false,
					appearance: {
						panelMobile: {
							tone: '#D62222',
							sideMargin: 30,
							ratio: 'part',
							headHeight: 50
						}
					}
				})
				//传递客户信息
				window._AIHECONG('customer', {
					head: _this.userInfo.avatar,
					'名称': _this.userInfo.nickname,
					'手机': _this.userInfo.mobile
				})
				window._AIHECONG('showChat')
				// #endif

				// 客服页面
				// #ifdef APP-PLUS || APP-PLUS-NVUE
				this.$common.navigateTo('../customer_service/index');
				// #endif

				// 头条系客服
				// #ifdef MP-TOUTIAO
				if (this.shopMobile != 0) {
					let _this = this;
					tt.makePhoneCall({
						phoneNumber: this.shopMobile.toString(),
						success(res) {},
						fail(res) {}
					});
				} else {
					_this.$common.errorToShow('暂无设置客服电话');
				}
				// #endif
			},
			//获取分享URL
			getShareUrl() {
				let data = {
					client: 2,
					url: "/pages/share/jump",
					type: 1,
					page: 10,
					params: {
						goods_id: this.goodsInfo.id,
					}
				};
				let userToken = this.$db.get('userToken');
				if (userToken && userToken != '') {
					data['token'] = userToken;
				}
				this.$api.share(data, res => {
					this.shareUrl = res.data
				});
			}
		},
		watch: {
			goodsInfo: {
				handler() {
					this.getShareUrl();
				},
				deep: true
			}
		},
		// let myInviteCode = this.myShareCode ? this.myShareCode : '';
		// let ins = this.$common.shareParameterDecode('type=1&invite=' + myInviteCode);
		// let path = '/pages/share/jump?scene=' + ins;
		// return {
		// 	title: this.$store.state.config.share_title,
		// 	// #ifdef MP-ALIPAY
		// 	desc: this.$store.state.config.share_desc,
		// 	// #endif
		// 	imageUrl: this.$store.state.config.share_image,
		// 	path: path
		// }
		//分享
		onShareAppMessage() {
			console.log(this.myShareCode+"myInviteCode")
			return {
				title: this.goodsInfo.name,
				// #ifdef MP-ALIPAY
				desc: this.goodsInfo.brief,
				// #endif
				imageUrl: this.goodsInfo.album[0],
				path: `/pages/goods/index/carInfo?scene=${this.myShareCode}&id=${this.goodsInfo.id}` 
			}
			// this.$common.navigateTo('/pages/classify/productList?indexId='+indexId+'&title=电器');
			console.log(path)
		}
	}
</script>

<style>
	.cell-item{
		    margin-top: 5px;
			border: none;
	}
	table{
	  border-collapse: collapse
	}

	 table tr{ 
		 line-height:40px;
		  border-bottom:0.5px solid #CACACA;
	 } 
	 
	 table td{
		     padding-left: 11px;
	 }
	.car-time {
		display: flex;
		flex-direction: row;
		justify-content: space-around;
		margin: 17px 0;
		padding-bottom: 17px;
	}
.car-main{
	color: #999999;
	padding-left: 13px;
	font-size: 13px;
}
	.swiper {
		height: 750upx;
	}

	.goods-top {
		border-bottom: 0;
	}

	.goods-top .goods-price {
		font-size: 38upx;
	}

	.cost-price {
		font-size: 28upx !important;
		bottom: -10upx;
		color: #999;
		text-decoration: line-through;
	}

	.goods-top .cell-item-ft {
		font-size: 20upx;
		color: #666;
	}

	.goods-details {
		padding-top: 0;
	}

	.goods-details .cell-hd-title {
		width: 620upx;
	}

	.goods-details .cell-hd-title .cell-hd-title-view {
		width: 100%;
		display: -webkit-box;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 2;
		overflow: hidden;
	}

	.goods-details .cell-hd-title .cell-hd-title-view:last-child {
		margin-top: 10upx;
	}

	.goods-details .cell-item-ft {
		top: 24upx;
	}

	.goods-title-item .cell-item-hd {
		min-width: 60upx;
		color: #666;
		font-size: 24upx;
	}

	.goods-title-item .cell-item-bd {
		color: #333;
		font-size: 24upx;
		display: block;
	}

	.goods-title-item .cell-bd-text {
		bottom: 0;
	}

	.cell-bd-view {
		position: relative;
		overflow: hidden;
		margin-bottom: 8upx;
	}

	.cell-bd-view:last-child {
		margin-bottom: 0;
	}

	.goods-title-item-ic {
		width: 22upx;
		height: 22upx;
		position: absolute;
		top: 50%;
		transform: translateY(-50%);
		/* #ifdef MP-ALIPAY */
		background-size: 100% 100%;
		/* #endif */
	}

	.cell-bd-view .cell-bd-text {
		margin-left: 30upx;
	}

	.goods-content {
		margin-top: 26upx;
		background-color: #fff;
		padding: 26upx 0;
	}

	.goods-content-c {
		margin-top: 20upx;
	}

	.goods-parameter {
		padding: 10upx 26upx;
		min-height: 600rpx;
	}

	.goods-bottom,
	.pop-b {
		background-color: #fff;
		position: fixed;
		bottom: 0;
		height: 90upx;
		width: 100%;
		overflow: hidden;
		box-shadow: 0 0 20upx #ccc;

	}

	.goods-bottom .btn {
		height: 100%;
		width: 29%;
		float: left;
	}

	.goods-bottom-ic {
		display: inline-block;
		position: relative;
		text-align: center;
		height: 100%;
		width: 14%;
		float: left;
		font-size: 22upx;
		color: #666;
	}

	.goods-bottom-ic .icon {
		position: relative;
		top: 6upx;
		/* #ifdef MP-ALIPAY */
		background-size: 100% 100%;
		/* #endif */
	}

	.goods-bottom .btn-g {
		color: #333;
		background-color: #D9D9D9;
	}

	.goods-parameter .cell-item {
		border-bottom: none;
		margin-left: 0;
	}

	.goods-parameter .cell-item-hd {
		color: #333;
		font-size: 24upx;
	}

	.goods-parameter .cell-item-bd {
		color: #999;
	}

	.goods-parameter .cell-item-bd .cell-bd-text {
		bottom: 0;
	}

	.goods-parameter .cell-bd-text {
		margin-left: 0;
	}

	.pop-t {
		position: relative;
		padding: 30upx 26upx;
		border-bottom: 2upx solid #f3f3f3;
	}

	.goods-img {
		width: 160upx;
		height: 160upx;
		position: absolute;
		top: -20upx;
		background-color: #fff;
		border-radius: 6upx;
		border: 2upx solid #fff;

	}

	.goods-img image {
		height: 100%;
		width: 100%;
	}

	.goods-information {
		width: 420upx;
		display: inline-block;
		margin-left: 180upx;
	}

	.pop-goods-name {
		width: 100%;
		overflow: hidden;
		white-space: nowrap;
		text-overflow: ellipsis;
		display: block;
		font-size: 24upx;
		margin-bottom: 20upx;
	}

	.pop-goods-price {
		font-size: 30upx;
	}

	.close-btn {
		width: 40upx;
		height: 40upx;
		border-radius: 50%;
		display: inline-block;
		position: absolute;
		right: 30upx;
	}

	.close-btn image {
		width: 100%;
		height: 100%;
	}

	.pop-m {
		font-size: 28upx;
		margin-bottom: 90upx;
	}

	.goods-specs,
	.goods-number {
		padding: 26upx;
		border-top: 1px solid #f3f3f3;
	}

	.goods-specs:first-child {
		border: none;
	}

	.pop-m-title {
		margin-right: 10upx;
		color: #666;
	}

	.pop-m-bd {
		overflow: hidden;
		margin-top: 10upx;
	}

	.pop-m-item {
		display: inline-block;
		float: left;
		padding: 6upx 16upx;
		background-color: #fff;
		color: #333;
		margin-right: 16upx;
		margin-bottom: 10upx;
	}

	.selected {
		border: 2upx solid #333;
		background-color: #333;
		color: #fff;
	}

	.not-selected {
		border: 2upx solid #ccc;
	}

	.none {
		border: 2upx dashed #ccc;
		color: #888;
	}

	.pop-m-bd-in {
		display: inline-block;
	}

	.badge {
		top: 2upx;
		left: 62upx;
	}

	.goods-assess .user-head-img {
		width: 80upx;
		height: 80upx;
		border-radius: 50%;
	}

	.goods-assess .cell-item-bd {
		padding-right: 0;
	}

	.goods-assess .cell-bd-text {
		margin: 0;
	}

	.goods-assess .cell-bd-text.color-9 {
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
		max-width: 440upx;
	}

	.gai-body {}

	.gai-body-text {
		font-size: 26upx;
		color: #333;
		padding: 0 26upx;
		word-wrap: break-word;
	}

	.gai-body-img {
		overflow: hidden;
		padding: 20upx 26upx;
	}

	.gai-body-img image {
		width: 220upx;
		height: 220upx;
		float: left;
		margin-right: 19upx;
		margin-bottom: 18upx;
	}

	.gai-body-img image:nth-child(3n) {
		margin-right: 0;
	}

	.redstar {
		width: 24rpx;
		height: 24rpx;
		padding: 2rpx;
	}

	.mask-share-wechat {
		display: inline-block;
		background-color: #fff;
		padding: 0;
	}

	.mask-share-wechat:after {
		border: none;
	}

	.right-ball {
		position: fixed;
		right: 30upx;
		bottom: 300upx;
		z-index: 999;
		text-align: center;
		padding: 14upx 0;
		width: 80upx;
		height: 80upx;
		font-size: 24upx;
		color: #fff;
		background-color: rgba(0, 0, 0, .5);
		border-radius: 50%;
	}

	.comment-none {
		text-align: center;
		padding: 160upx 0;
	}

	.comment-none-img {
		width: 274upx;
		height: 274upx;
	}


	.price-salesvolume {
		width: 100%;
		padding: 0 0 0 26upx;
		overflow: hidden;
		color: #A5A5A5;
		background-color: rgb(252, 226, 80);
		position: relative;
	}

	.commodity-price {
		width: 224upx;
		display: inline-block;
		float: left;
	}

	.current-price {
		font-size: 40upx;
		color: #D62222;
		display: block;
		line-height: 1.5;
	}

	.cost-price {
		font-size: 26upx;
		text-decoration: line-through;
		display: block;
	}

	.commodity-salesvolume {
		width: 240upx;
		display: inline-block;
		font-size: 22upx;
		float: left;
		padding: 16upx 0;
	}

	.commodity-salesvolume>text {
		display: block;
	}

	.commodity-time-img {
		display: block;
		width: 0;
		height: 0;
		border-width: 48upx 28upx 50upx 0;
		border-style: solid;
		border-color: transparent #D62222 transparent transparent;
		/*透明 黄 透明 透明 */
		position: absolute;
		top: 0px;
		left: 462upx;
	}

	.commodity-time {
		display: inline-block;
		width: 260upx;
		text-align: center;
		font-size: 24upx;
		background-color: #D62222;
		padding: 16upx 0 18upx;
		color: rgb(250, 233, 0);
	}

	.commodity-time>text {
		display: block;
	}

	.commodity-day {
		font-size: 22upx;
	}

	.commodity-day>text {
		display: inline-block;
		background-color: rgb(255, 212, 176);
		color: rgb(255, 115, 0);
		padding: 0 6upx;
		border-radius: 6upx;
	}

	.nav-back {
		width: 100%;
		height: 44px;
		/* #ifndef MP-WEIXIN */
		padding: 12px 12px 0;
		/* #endif */
		/* #ifdef MP-WEIXIN */
		padding: 26px 12px 0;
		/* #endif */

		position: fixed;
		top: 0;
		background-color: rgba(255, 255, 255, 0);
		z-index: 98;
	}

	.back-btn {
		height: 32px;
		width: 32px;
		border-radius: 50%;
		background-color: rgba(255, 255, 255, 0.8);
	}

	.back-btn .icon {
		height: 20px;
		width: 20px;
		position: relative;
		top: 50%;
		left: 46%;
		transform: translate(-50%, -50%);
	}

	.seller-content {
		background-color: #f8f8f8;
		margin: 0 13px 15px;
		padding: 10px;
		color: #6e6e6e;
		border-radius: 4px;
	}

	.seller-content-top {
		font-weight: bold;
		margin-bottom: 6px;
	}

	.seller-content-img {
		width: 20px;
		height: 20px;
		vertical-align: middle;
		margin-right: 4px;
	}

	.service {
		width: 80rpx;
		height: 80rpx;
		background-color: #fff;
		border-radius: 50%;
		position: fixed;
		left: 30rpx;
		bottom: 120rpx;
		display: flex;
		justify-content: center;
		align-items: center;
		box-shadow: 0 0 10rpx #ccc;
		padding: 0;
	}

	.service .icon {
		width: 60rpx;
		height: 60rpx;
	}

	/* #ifdef MP-WEIXIN */
	.weiContact {
		background-color: #fff;
		border: none;
	}

	.weiContact::after {
		border: none;
	}

	.weiContact>view {
		position: absolute;
		top: 45rpx;
		left: 50%;
		transform: translateX(-50%);

	}
	/* #endif */
	
	.info-table{
		display: flex;
		flex-direction: row;
		    justify-content: space-between;
		flex-wrap: wrap;
		border-radius: 3px;
		     border-left: 1px solid #CACACA;
		     /* border: 1px solid #CACACA; */
		     border-right: 1px solid #CACACA;
		     border-top: 1px solid #CACACA;
	}
	
	.car-time-item{
		width: 33.3%;
		    text-align: center;
		    border-left: 1px solid #E8E8E8;
	}
	.car-time-item:nth-of-type(1){
		border-left:none;
	 }
	.table-item{
		    width: 50%;
			height: 40px;
			line-height: 40px;
			padding-left: 11px;
			border-right:  1px solid #CACACA;
			border-bottom: 1px solid #CACACA;
	}
	
		
	.table-item:nth-child(even){
		border-right:none;
	}
		
	.table-main{
		font-size: 13px;color: #999999;padding-left: 11px;
	}
	.table-title{
		font-size: 13px;color: #666666;font-weight: bold;
	}
	
	
	/*咨询*/
	#father {
	    display: -webkit-box;
	    display: -webkit-flex;
	    display: flex;
	    -webkit-box-pack: center;
	    -webkit-justify-content: center;
	    justify-content: center;
	    -webkit-box-align: center;
	    -webkit-align-items: center;
	    align-items: center;
	    background: rgba(0, 0, 0, 0.6);
	    height: 100vh;
	    font-size: 17px;
	    font-weight: bold;
	    position: fixed;
	    z-index: 9999;
	    top: 0;
	    left: 0;
	    right: 0;
	}
	
	#son {
		width: 270px;
		height: 236px;
		background: rgba(235, 235, 235, 1);
		border-radius: 10px;
		text-align: center;
		position: relative;
	}
	
	.fee-input {
		width: 238px;
		height: 38px;
		background: rgba(255, 255, 255, 1);
		border-radius: 6px;
		line-height: 38px;
		text-align: left;
		padding-left: 17px;
		margin: 0 16px;
	}
	
	.fee-but {
		width: 87px;
		height: 38px;
		background: rgba(214, 34, 34, 1);
		border-radius: 6px;
		text-align: center;
		line-height: 38px;
		color: #FFFFFF;
		margin: 23px auto;
	}
	.father-wrapper{
		    display: flex;
		    align-items: center;
		    justify-content: center;
	}
	.paoma{
	position: fixed;
	    top: 60px;
	    left: 0;
	    /* z-index: 999; */
	    /* width: 100%; */
	    width: 258px;
	    height: 36px;
	    background: rgba(0,0,0,0.3);
	    border-radius: 0px 50px 50px 0px;
	    overflow: hidden;
	    z-index: 9;
	}
	.paoma-c{
		height: 35px;
    color: #fff;
    line-height: 35px;
    padding: 0 16px;
	}
	.retoyou{
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
	}
	.reto-title{
		    width: 310upx;
		    overflow: hidden;
		    white-space: nowrap;
		    text-overflow: ellipsis;
			color: #1E1F20;
			padding: 5px 0;
	}
	.reto-pci{
		    color: #D62222;
	}
	.reto-item{
		    background-color: #fff;
		    display: -webkit-box;
		    display: -webkit-flex;
		    display: flex;
		    -webkit-box-orient: vertical;
		    -webkit-box-direction: normal;
		    -webkit-flex-direction: column;
		    flex-direction: column;
		    text-align: left;
		    /* padding-right: 10px; */
		    /* -webkit-box-flex: 1; */
		    /* -webkit-flex: 1; */
		    /* flex: 1; */
		    width: 45%;
		    margin-top: 14px;
		    margin-right: 14px
		}
		uni-button:after{
			border: none !important;
		}
		button::after {
			border: none !important;
		}
		.aa_bh{
			width: 100% !important;
		}
</style>
